<script setup lang="ts">
import { ref, computed } from 'vue';
import YNav from '@/layouts/YNav.vue';
import YMain from '@/layouts/YMain.vue';
import Menu from '@/components/Menu/index.vue';
import TestRoutes from '@/router/modules/test';
import { useRoute } from 'vue-router';
const route = useRoute();
// Test页下的所有子路由
const routes = TestRoutes[0].children!;
const activeIndex = computed(() => route.path.replace('/test/', ''));
// 搜索关键字
const keyword = ref('');

const filterRoutes = computed(
  () =>
    routes.filter((route) =>
      (route.name as string).toLowerCase().startsWith(`test.${keyword.value.toLowerCase()}`),
    )!,
);
</script>

<script lang="ts">
export default {
  name: 'TestLayout',
};
</script>

<template>
  <Y-Nav class="bg-slate-500">
    <Menu :routes="filterRoutes" :active-index="activeIndex" />
  </Y-Nav>
  <Y-Main>
    <router-view></router-view>
  </Y-Main>
</template>

<style scoped></style>
